import { useSearchParams } from 'react-router-dom'
import './index.scss'
import { getSearchAPI } from '@/api/search'
import { useEffect, useState } from 'react'
import Article from '@/components/Article'
import { Card } from 'antd'

const SearchBlog = () => {
  const [searchParams] = useSearchParams()
  const query = searchParams.get('query')

  // 获取博客
  const [blogList, setBlogList] = useState([])
  const getSearchBlogInfo = async (query) => {
    try {
      const res = await getSearchAPI(query)
      setBlogList(res.data)
    } catch (error) {
      console.error('获取搜索结果出错:', error)
    }
  }
  useEffect(() => {
    getSearchBlogInfo(query)
  }, [query])
    return (
        <div className="search">
            <Card
             title='为您找到以下结果'>
            <Article
              blogList={blogList}
            />
            </Card>
        </div>
    )
}

export default SearchBlog